<template>
	<view class="my-3" style="margin-left: 0;margin-right: 0;">
		<uni-card margin="0" :is-shadow="false" padding="0" spacing="0">
			<view class="content-container">
				<view class="content-img">
					<image style="flex: 1;height: 100%;"  mode="scaleToFill" src="https://cx-img.zmn.cn/home/20230714/1689313075627.jpg"></image>
				</view>
				<view class="mt-3">
					<view class="manage-container">
						<view class="manage-img-text">
							<!-- 头像图片 -->
							<view class="manage-left-img">
								<image mode="scaleToFill" style="flex: 1;height: 100%;" src="https://cx-img.zmn.cn/home/20230714/1689313075627.jpg"></image>
							</view>
							<view class="manage-center-text">
								<text class="text-white font-weight-bold">
									洗衣机清洗(专业拆机)
								</text>
								<text class="text-white font-sm">
									140℃高温蒸汽+内筒精洗
								</text>
							</view>
						</view>
            <view class="manage-center-right-botton flex justify-center align-center">
              <text class="font-sm text-dark font-weight-bold">看详情</text>
            </view>
					</view>
				</view>
			</view>
		</uni-card>
	</view>
</template>

<script>
</script>

<style lang="scss">
.manage-center-right-botton {
  background: #FFFFFF;
  border-radius: 30px;
  padding: 5px 15px;
}
	.content-container {
		height: 870rpx;
		background-color: skyblue;

		.content-img {
			height: 78%;
			width: 100%;
			background-color: burlywood;
			border-radius: $uni-border-radius;
			display: flex;
			flex-direction: row;
			position: relative;
			overflow: hidden;
		}

		.manage-container {
			height: 100rpx;
			padding: 10px;
			display: flex;
			flex-direction: row;
			justify-content: space-between;
			align-items: center;

			.manage-img-text {
				display: flex;
				flex-direction: row;

				.manage-left-img {
					height: 50px;
					width: 80px;
					border-radius: $uni-border-radius;
					display: flex;
					overflow: hidden;
				}

				.manage-center-text {
					display: flex;
					margin-left: 20rpx;
					flex-direction: column;
					justify-content: center;
				}
			}
		}
	}
</style>
